<template>
  <!-- :style="{ height: windowHeight + 'px' }" -->
  <div class="box">
    <div class="banner">
      <div class="scan">
        <el-input
          v-model="entname"
          placeholder="请输入企业名称/股东高管/商标名称/专利"
          clearable
          style="width: 800px"
        />
        <h4 @click="scan">查询</h4>
      </div>
    </div>
    <div class="f2">
      <div class="f2_content">
        <template v-if="list">
          <template v-if="status">
            <div class="result" v-for="(item, index) in list" :key="index">
              <div class="result_left" @click="getDetails(item)">
                <div class="result_left_top">
                  <h1>{{ item.name }}</h1>
                </div>
                <div class="result_left_bottom">
                  <h4>统一社会信用代码：{{ item.credit_no }}</h4>
                  <h4>法定代表人：{{ item.oper_name }}</h4>
                  <h4>成立日期：{{ item.start_date }}</h4>
                </div>
              </div>
            </div>
          </template>
          <template v-else>
            <div class="f2_f1" v-if="enterpriseInformation">
              <div class="title">
                <div>
                  <p>{{ enterpriseInformation.keyword }}</p>
                  <h6>{{ enterpriseInformation.newstatus }}</h6>
                </div>
                <div>
                  <img
                    @click="download(enterpriseInformation)"
                    src="@/assets/query/组123.png"
                    alt=""
                  />
                  <img
                    @click="goRiskqueryind"
                    src="@/assets/query/组124.png"
                    alt=""
                  />
                </div>
              </div>
              <div class="details" v-if="enterpriseInformation">
                <div class="details-item">
                  <div class="details-item-left">
                    <ul>
                      <li>统一社会信用代码：</li>
                      <li>成立日期：</li>
                      <li>所属行业：</li>
                      <li>注册资本：</li>
                    </ul>
                    <div>
                      <p>{{ credit_no }}</p>
                      <p>{{ enterpriseInformation.startdate }}</p>
                      <p>{{ enterpriseInformation.domain }}</p>
                      <p>{{ enterpriseInformation.registcapi }}</p>
                    </div>
                  </div>
                  <div class="details-item-left" style="margin-left: 240px">
                    <ul style="width: 125px">
                      <li>法定代表人：</li>
                      <li>实缴资本：</li>
                      <li>企业类型：</li>
                      <li>地址：</li>
                    </ul>
                    <div>
                      <p>{{ enterpriseInformation.opername }}</p>
                      <p>{{ enterpriseInformation.actualcapi }}</p>
                      <p>{{ enterpriseInformation.econkind }}</p>
                      <p style="width: 270px">
                        {{ enterpriseInformation.address }}
                      </p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="f3">
              <div class="tabs">
                <div
                  class="list"
                  :class="{ active: row == 1 }"
                  @click="row = 1"
                >
                  基本信息
                </div>
                <div
                  class="list"
                  :class="{ active: row == 2 }"
                  @click="row = 2"
                >
                  诉讼信息
                </div>
                <div
                  class="list"
                  :class="{ active: row == 3 }"
                  @click="row = 3"
                >
                  经营风险
                </div>
                <div
                  class="list"
                  :class="{ active: row == 4 }"
                  @click="row = 4"
                >
                  经营信息
                </div>
                <div
                  class="list"
                  :class="{ active: row == 5 }"
                  @click="row = 5"
                >
                  企业发展
                </div>
                <div
                  class="list"
                  :class="{ active: row == 6 }"
                  @click="row = 6"
                >
                  知识产权
                </div>
              </div>
              <div class="details" v-show="row == 1">
                <Gsxx :credit_no="credit_no" :name="aaa" />
                <Gdxx :name="aaa" />
                <Zyryxx :name="aaa" />
                <Dwtzxx :name="aaa" />
                <Bgjl :name="aaa" />
                <Fzjg :name="aaa" />
                <Frdwtz :name="aaa" />
              </div>
              <div class="details" v-show="row == 2">
                <Zxgg :name="aaa" /><!-- 执行公告 -->
                <Sxxx :name="aaa" /><!-- 失信公告 -->
                <Cpws :name="aaa" /><!-- 裁判文书 -->
                <Fygg :name="aaa" /><!-- 送达公告/法院公告 -->
                <Ktgg :name="aaa" /><!-- 开庭公告 -->
                <Zbaj :name="aaa" /><!-- 终本案件 -->
                <Xzgxf :name="aaa" /><!-- 限制高消费 -->
              </div>
              <div class="details" v-show="row == 3">
                <Jyyc :name="aaa" />
                <Qsgg :name="aaa" />
                <!-- 行政处罚 -->
                <Xzcf :name="aaa" />

                <!-- 严重违法失信 -->
                <Yzwfsx :name="aaa" />
                <Gqzy :name="aaa" />

                <!-- 股权冻结 -->
                <Gqdj :name="aaa" />
                <Dcdy :name="aaa" />
              </div>
              <!-- 经营信息 -->
              <div class="details" v-show="row == 4">
                <Ztb :name="aaa" />
                <Zzzs :name="aaa" />
                <!-- <Nsrzz :name="aaa" /> -->
              </div>
              <!-- 企业发展 -->
              <div class="details" v-show="row == 5">
                <Rzxx :name="aaa" />
                <Xwyq :name="aaa" />
              </div>
              <!--知识产权-->
              <div class="details" v-show="row == 6">
                <Sbxx :name="aaa" />
                <Zlxx :name="aaa" />
                <Zzq :name="aaa" />
                <Rjzzq :name="aaa" />
              </div>
            </div>
          </template>
        </template>
        <template v-else>
          <img src="../../assets/report/组103.png" alt="" />
          <h3 v-show="!isLoke">查询无结果，请重新输入查询条件</h3>
          <h3 v-show="isLoke">查询中.....</h3>
        </template>
      </div>
    </div>
  </div>
</template>

<script>
import { myPostFetch } from "@/api/report";
import { findfxsmxq } from "@/api/brran/riskqueryind";
//基础信息
import Gsxx from "../query/components/Jcxx/Gsxx.vue";
import Gdxx from "../query/components/Jcxx/Gdxx.vue";
import Zyryxx from "../query/components/Jcxx/Zyryxx.vue";
import Dwtzxx from "../query/components/Jcxx/Dwtzxx.vue";
import Bgjl from "../query/components/Jcxx/Bgjl.vue";
import Fzjg from "../query/components/Jcxx/Fzjg.vue";
import Frdwtz from "../query/components/Jcxx/Frdwtz.vue";
// 诉讼信息
// import Bzxr from "../query/components/ssxx/Bzxr.vue";
import Fygg from "../query/components/ssxx/Fygg.vue";
import Sxxx from "../query/components/ssxx/Sxxx.vue";
import Cpws from "../query/components/ssxx/Cpws.vue";
import Gqdj from "../query/components/ssxx/Gqdj.vue";
import Zxgg from "../query/components/ssxx/Zxgg.vue";
import Xzgxf from "../query/components/ssxx/Xzgxf.vue";
import Zbaj from "../query/components/ssxx/Zbaj.vue";
import Ktgg from "../query/components/ssxx/Ktgg.vue";
// 经营风险
import Jyyc from "../query/components/jyfx/Jyyc.vue";
import Qsgg from "../query/components/jyfx/Qsgg.vue";
import Gqzy from "../query/components/jyfx/Gqzy.vue";
import Dcdy from "../query/components/jyfx/Dcdy.vue";
import Xzcf from "../query/components/jyfx/Xzcf.vue";
import Yzwfsx from "../query/components/jyfx/Yzwfsx.vue";

// 经营信息
import Ztb from "./components/jyxx/Ztb.vue";
import Zzzs from "./components/jyxx/Zzzs.vue";
import Nsrzz from "./components/jyxx/Nsrzz.vue";
// 企业发展
import Rzxx from "./components/qyfz/Rzxx.vue";
import Xwyq from "./components/qyfz/Xwyq.vue";
//知识产权
import Sbxx from "./components/zscq/Sbxx.vue";
import Zlxx from "./components/zscq/Zlxx.vue";
import Zzq from "./components/zscq/Zzq.vue";
import Rjzzq from "./components/zscq/Rjzzq.vue";

export default {
  components: {
    Gsxx,
    Gdxx,
    Zyryxx,
    Dwtzxx,
    Bgjl,
    Fzjg,
    Frdwtz,
    Jyyc,
    Qsgg,
    Gqzy,
    Dcdy,
    Ztb,
    Zzzs,
    Nsrzz,
    Rzxx,
    Xwyq,
    Sbxx,
    Zlxx,
    Zzq,
    Rjzzq,
    // Bzxr,
    Fygg,
    Sxxx,
    Cpws,
    Gqdj,
    Zxgg,
    Xzgxf,
    Zbaj,
    Ktgg,
    Yzwfsx,
    Xzcf,
  },
  data() {
    return {
      windowHeight: document.documentElement.clientHeight, // 实时屏幕高度
      loading: false,
      isLoke: false,
      row: 1,
      aaa: "", // 临时变量
      status: true,
      entname: "",
      list: null,
      enterpriseInformation: null,
      credit_no: "", //统一社会信用代码
    };
  },
  mounted() {
    this.entname = this.$route.query.entname;
    document.documentElement.scrollTop = 0;
    this.scan();
  },
  methods: {
    // 下载报告
    download(data) {
      let name = data.name;
      let credit_no = this.credit_no;
      sessionStorage.setItem("credit_no", credit_no);
      sessionStorage.setItem("matchItems", name);
      this.$router.push("/getReport");
    },
    // 跳转至风险扫描
    goRiskqueryind() {
      this.$router.push(`/brran/riskqueryind?entname=${this.aaa}`);
    },
    async scan() {
      if (this.entname == "") return this.$Message.error("请输入内容");
      this.isLoke = true;
      let url = "/credit/mohu";
      let params = {
        keyword: this.entname,
      };
      setTimeout(() => {
        this.isLoke = false;
      }, 5000);
      let data = await myPostFetch(url, params);
      if (data.code == 200) {
        this.list = data.data.items;
        this.status = true;
        this.isLoke = false;
        return;
      }
    },
    getDetails(item) {
      const loading = this.$loading({
        //lock的修改符--默认是false
        lock: true,
        //显示在加载图标下方的加载文案
        text: "拼命加载中",
        //自定义加载图标类名(在elementUI 文档查找)
        // spinner: "el-icon-loading",
        //(可以自己定义)遮罩层颜色
        background: "rgba(255, 255, 255, .8)",
        //loadin覆盖的dom元素节点(整个页面的话'#body' 表格的话'#table'等等 )
        target: document.querySelector("#body"),
      });
      let url = "/credit/dataupdate";
      let params = {
        n: item.name,
        id: item.credit_no,
      };
      myPostFetch(url, params).then((res) => {
        if (res.msg == "succ") {
          let entname = item.name;
          this.aaa = entname;
          this.findfxsmxq(entname);
          this.credit_no = item.credit_no;
          this.status = false;
          //成功回调函数停止加载
          loading.close();
        } else {
          //成功回调函数停止加载
          loading.close();
        }
      });
    },

    // 获取企业信息
    async findfxsmxq(entname) {
      let url = "/credit/creditinfo";
      let params = {
        n: entname,
      };
      let data = await myPostFetch(url, params);
      this.enterpriseInformation = data.base;
    },
  },
};
</script>
<style scoped lang="scss">
/*去掉列表前面的小点*/
ul {
  list-style: none;
}
.box {
  box-sizing: border-box;
  width: 100%;
  background-color: #f5f7fa;
  .banner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 230px;
    background: url(@/assets/query/组122.png);
    background-size: 100% 100%;

    .scan {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 52px;
      h4 {
        cursor: pointer;
        align-items: center;
        justify-content: center;
        display: flex;
        width: 100px;
        height: 52px;
        background: #ff752c;
        border-radius: 0px 4px 4px 0px;
        color: #fff;
        font-size: 20px;
        font-weight: 400;
      }
    }
  }
  .f2 {
    width: 100%;
    .f2_content {
      display: flex;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      padding-bottom: 80px;
      padding-top: 50px;
      width: 1200px;
      // height: 900px;
      margin: 0 auto;
      img {
        width: 340px;
        height: 160px;
      }
      h3 {
        font-size: 16px;
        color: #333;
        margin-bottom: 15px;
      }
      // 查询结果
      .result {
        cursor: pointer;
        display: flex;
        box-sizing: border-box;
        padding: 37px 80px 35px 54px;
        margin-bottom: 30px;
        width: 1200px;
        height: 145px;
        background: #ffffff;
        box-shadow: 0px 6px 20px 0px rgba(179, 197, 223, 0.26);
      }
      .result_left {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        flex: 1;
        height: 100%;
        .result_left_top {
          display: flex;
          align-items: center;
          h1 {
            font-size: 22px;
            font-family: Source Han Sans SC;
            font-weight: bold;
            color: #000000;
          }
          h6 {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 41px;
            height: 19px;
            background-color: #47af5d;
            border-radius: 2px;
            font-size: 14px;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #ffffff;
            margin-left: 22px;
            // &.ky {
            //   background: #615ff5;
            // }
            // &.zx {
            //   background-color: #f06900;
            // }
            // &.dx {
            //   background-color: #f64444;
            // }
            // &.cx {
            //   background-color: #587cbe;
            // }
            // &.qc {
            //   background-color: #bd97df;
            // }
            // &.slz {
            //   background-color: #6bc4c7;
            // }
            // &.qsz {
            //   background-color: #b77757;
            // }
            // &.ty {
            //   background-color: #7d6c8c;
            // }
            // &.qt {
            //   background-color: #5a7374;
            // }
            // &.xy {
            //   background-color: #73594c;
            // }
            // &.zlgb {
            //   background-color: #464d74;
            // }
          }
        }
        .result_left_bottom {
          display: flex;
          align-items: center;
          h4 {
            font-size: 16px;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #7a7a7a;
            margin-right: 60px;
          }
        }
      }
      .result_right {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 160px;
        height: 100%;
        .btn {
          cursor: pointer;
          display: flex;
          justify-content: center;
          align-items: center;
          width: 160px;
          height: 32px;
          background: #0a7be0;
          border-radius: 4px;
          font-size: 16px;
          font-family: Source Han Sans SC;
          font-weight: 300;
          color: #ffffff;
        }
      }
      // 信息
      .f2_f1 {
        width: 100%;
        box-sizing: border-box;
        padding: 33px 54px;
        background: #ffffff;
        box-shadow: 0px 6px 20px 0px rgba(179, 197, 223, 0.26);
        .title {
          display: flex;
          align-items: center;
          justify-content: space-between;
          width: 100%;
          margin-bottom: 40px;
          div {
            display: flex;
            align-items: center;
            p {
              font-size: 22px;
              font-family: Source Han Sans SC;
              font-weight: bold;
              color: #000000;
            }
            h6 {
              width: 41px;
              height: 19px;
              background: #47af5d;
              border-radius: 2px;
              font-size: 14px;
              font-family: Source Han Sans SC;
              font-weight: 400;
              color: #ffffff;
              text-align: center;
              line-height: 20px;
              margin-left: 15px;
            }
            img {
              cursor: pointer;
              width: 143px;
              height: 31px;
              margin-left: 18px;
            }
          }

          .hint {
            box-sizing: border-box;
            padding: 1px 4px;
            background: #ffebeb;
            margin-left: 15px;
            display: flex;
            align-items: center;
            img {
              width: 14px;
              height: 14px;
            }
            h5 {
              text-align: center;
              line-height: 18px;
              margin-left: 5px;
              font-size: 12px;
              font-family: Source Han Sans SC;
              font-weight: 300;
              color: #ff4040;
            }
          }
        }

        .details {
          box-sizing: border-box;
          padding: 0 20px;
          padding-bottom: 15px;
          width: 100%;
          background-color: #f2f8fc;
          .details-item {
            display: flex;
            // justify-content: space-between;
            width: 100%;
            .details-item-left {
              display: flex;
              height: 100%;
              ul {
                width: 173px;
                height: 100%;
                font-size: 14px;
                font-family: Source Han Sans SC;
                font-weight: 400;
                color: #666666;
                li {
                  margin-top: 15px;
                }
              }
              div {
                height: 100%;
                // overflow: hidden;
                // white-space: nowrap;
                // text-overflow: ellipsis;
                z-index: 99;
                p {
                  margin-top: 15px;
                  font-size: 14px;
                  font-family: Source Han Sans SC;
                  font-weight: 400;
                  color: #333333;
                }
              }
            }
          }
          .manage {
            width: 192px;
            height: 100%;
            font-size: 14px;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #666666;
            li {
              margin-top: 15px;
            }
          }
          .manage_p {
            font-size: 14px;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #333333;
            line-height: 30px;
          }
        }
      }
      .f3 {
        box-sizing: border-box;
        padding: 25px 54px;
        width: 1200px;
        background: #ffffff;
        box-shadow: 0px 6px 20px 0px rgba(179, 197, 223, 0.26);
        margin-top: 20px;
        .tabs {
          display: flex;
          width: 100%;
          height: 42px;
          .list {
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            box-sizing: border-box;
            width: 100px;
            height: 40px;
            font-size: 18px;
            font-family: Source Han Sans SC;
            font-weight: 500;
            color: #6e6e6e;
            margin-right: 20px;
            &.active {
              color: #0a7be0;
              border-bottom: 2px solid #0a7be0;
            }
          }
        }
        .details {
          width: 100%;
          margin-top: 50px;
        }
      }
    }
  }
}
::v-deep .el-input__inner {
  height: 52px;
  border-radius: 4px 0 0 4px;
}
</style>
